import { Fragment } from "react";
import { Navigate, Outlet, Route, Routes } from "react-router-dom";
import { ComponentsRoute, pageRoutes } from "./routes/account";

const App: React.FC = () => {

	function createRoute(routes: ComponentsRoute[]): React.ReactNode {
		return (
			<>
				{
					routes.map(route => (
						<Fragment key={route.name}>
							{
								route.defaultPath ? <Route path='' element={<Navigate to={route.path} />}></Route> : ''
							}
							<Route path={route.path} element={<route.component />}>
								{
									route.children ? createRoute(route.children) : ""
								}
							</Route>
						</Fragment>
					))
				}
			</>
		)
	}

  
	return (
		<div className="App">
			<Routes>
				{
					createRoute(pageRoutes)
				}
			</Routes>
		</div>
	);
}

export default App;
